{extend name="Layout/datagrid" /}
{block name="head_foot"}
<link rel="stylesheet" href="__ui_plugins__/colorpickerlib/colorpicker/bootstrap-colorpicker.min.css">    
{/block}
{block name="content_header"}        
<h1>
    外观管理
    <small>advanced tables</small>
</h1>
<ol class="breadcrumb">
    <li><a href="#"><i class="fa fa-dashboard"></i> 首页</a></li>
    <li><a href="#">界面</a></li>
    <li class="active">外观管理</li>
</ol>
{/block}
{block name="content"}
<div class="box">
    <div class="box-header">
        <ul class="nav nav-tabs">
            {foreach name="tabs" item="vo"}
            <li class="{$vo.active}"><a href="{:U($vo['url'])}">{$vo.title}</a></li>
            {/foreach}
        </ul>
    </div>
    <!-- /.box-header -->
    <div class="box-body">
        <div class="row">
            <div class="col-md-5">
                <!-- form start -->
                <form action="{:U('editSave')}" method="post" class="form-horizontal">
                    <div class="box-body">
                        <div class="form-group">
                            <label class="col-sm-3 control-label">背景颜色</label>
                            <div class="col-sm-9">
                                <div class="xsui-color-picker input-group colorpicker-component">
                                    <input type="text" name="bg_color" class="form-control" value="{$data.bg_color}" />
                                    <span class="input-group-addon"><i></i></span>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">背景图片</label>
                            <div class="col-sm-9">
                                <div class="input-group">
                                    <input type="text" name="bg_image" class="form-control input-sm"  placeholder="背景图片" value="{$data.bg_image}">
                                    <span class="input-group-btn">
                                        <a href="{:U('Uploader/delete')}" class="btn btn-default btn-sm xsui-btn-singlefile-delete-image" title="删除图片">删除</a>
                                        <a href="{:U('Uploader/single_file','name=bg_image')}" class="btn btn-default btn-sm xsui-btn-singlefile-uploader-image" title="选择图片并上传">上传</a>
                                        <a href="{$data.bg_image}" class="btn btn-default btn-sm" target="_blak">预览</a>
                                    </span>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-3 control-label">背景重复</label>
                            <div class="col-sm-9">
                                {xshtml:radio name="bg_repeat" data="array(''=>'不重复','h'=>'水平重复','v'=>'垂直重复','all'=>'全部重复')" value="data['bg_repeat']" /}
                            </div>
                        </div>
                    </div>
                    <!-- /.box-body -->
                    <div class="box-footer">
                        <button type="button" class="btn btn-default xsui-btn-close-dialog">取消</button>
                        <button type="submit" class="btn btn-primary pull-right">保存</button>
                    </div>
                    <!-- /.box-footer -->
                    <input type="hidden" name="id" value="{$data.id}"/>
                </form>
            </div>
        </div>
    </div>
    {/block}
    {block name="body_foot"}
    <script src="__ui_plugins__/colorpickerlib/colorpicker/bootstrap-colorpicker.min.js"></script>
    {/block}
    {block name="script_before"}
    <script>
        xsApp.xsfnUploadButtonInit();
        xsApp.xsfnColorPickerInputInit();
        /**
         * 单文件上传回调函数
         * @param {type} name
         * @param {type} value
         * @returns {undefined}
         * @version 1.0 2016-12-15
         */
        function single_uploader_cb(name, value) {
            var $input = $('[name="' + name + '"]');
            $input.val(value)
            //$input.parent().parent().find('img').attr('src', value).parent().attr({'href': value, 'title': value}).next().data('url', value);
            layer.closeAll();
            //$('iframe').parent().dialog('close');
        }
    </script>
    {/block}